﻿<extend name="Public:base" />
<block name="title"><title>账户安全</title></block>
<block name="header_styles">
</block>
<block name="main">
    <div class="row">
        <div class="col-xs-3">
            <div class="column-sidebar">
                <include file="Public:LeftMenu" />
            </div>
        </div>
        <div class="col-xs-9">
            <div class="column-main" style="min-height:550px;">
                <div class="section">
                    <div class="section-title">
                        账户安全管理中心
                    </div>
                    <div class="section-content">
                        <table class="account-safe">
                            <tr>
                                <td><img src="__Public__/themes/images/icon-security.png" width='46' /></td>
                                <td><strong>密保问题</strong></td>
                                <td>设定几个只有您自己知道的问题，以便找回密码或验证时使用。</td>
                                <td style="width:100px;">
                                    <if condition="$isQp eq 1"><span class="whitebtn">已设置</span><else /><a href="javascript:void(0)" class="whitebtn" id="btnQuestions">启动</a></if>
                                </td>
                            </tr>
                            <tr>
                                <td><img src="__Public__/themes/images/icon-mail.png" width='46' /></td>
                                <td><strong>密保邮箱</strong></td>
                                <td>与电子邮箱绑定，不但能在找回密码时使用，还能方便获取相关安全提醒信息。</td>
                                <td>
                                    <eq name="ep" value="1"><span class="whitebtn">已设置</span><else /><a href="javascript:void(0)" class="whitebtn" id="btnEmails">启动</a></eq>
                                </td>
                            </tr>
                            <tr>
                                <td><img src="__Public__/themes/images/icon-lock.png" width='46' /></td>
                                <td><strong>重设密码</strong></td>
                                <td>重新设置密码，修改后请牢记密码</td>
                                <td>
                                    <a href="javascript:void(0)" class="whitebtn" id="btnResetPassword">修改密码</a>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <br />

            </div>
        </div>
    </div>
</block>
<block name="footer_scripts">
    <div style="display: none;">
        <div class="box" id="boxQuestions" style="width:450px;">
            <div class="box-title">
                <a href="javascript:void(0)" class="pull-right" style="color: #ffffff;" onclick="$.fancybox.close();"><i class="fa fa-times"></i></a>
                密保问题设置
            </div>
            <div class="box-content">
                <div class="question-answers">
                    <h3 style="font-size:16px;">
                        为了避免遗忘，请您填写真实信息，这将帮助您以后通过回答问题快速找回登陆密码
                    </h3>
                    <div class="question-item">
                        <label>问题一：</label>
                        <select id="ddlQuestion1">
                            <for start="0" end="10">
                                <option value="{$qlist[$i].id}">{$qlist[$i].name}?</option>
                            </for>
                        </select>
                        <input type="text" id="txtAnswer1" maxlength="100" />
                    </div>
                    <div class="question-item">
                        <label>问题二：</label>
                        <select id="ddlQuestion2">
                            <for start="10" end="20">
                                <option value="{$qlist[$i].id}">{$qlist[$i].name}?</option>
                            </for>
                        </select>
                        <input type="text" id="txtAnswer2" maxlength="100" />
                    </div>
                </div>
                <p id="pqnotice" style="display: none;color: #F00;margin-left: 30px;"></p>
                <div class="box-buttons">
                    <button type="submit" class="greenbtn">确定</button>
                </div>
            </div>
        </div>
        <div class="box" id="boxBindingEmail" style="width:450px;">
            <div class="box-title">
                <a href="javascript:void(0)" class="pull-right" style="color: #ffffff;" onclick="$.fancybox.close();"><i class="fa fa-times"></i></a>
                绑定密保邮箱
            </div>
            <div class="box-content">
                <form onsubmit="return false;">
                    <div class="question-answers" style="width:360px;">
                        <h3 style="font-size:16px;">密保邮箱必须不同于注册邮箱<br />它仅用于您的密码找回!</h3>
                        <div class="question-item">
                            <label style="width: 60px;">EMAIL:</label>
                            <input type="text" id="txtEmail" name="txtEmail" maxlength="200"
                                   data-val="true" data-val-required="请输入邮箱地址"
                                   data-val-regex="请输入正确的邮箱地址"
                                   data-val-regex-pattern="^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$" />
                            <span id="pemailnotice" data-valmsg-for="txtEmail" data-valmsg-replace="true" style="padding-left: 40px;"></span>
                        </div>
                    </div>
                    <div class="box-buttons">
                        <button type="submit" class="greenbtn">确定</button>
                    </div>
                </form>
            </div>
        </div>
        <div class="box" id="boxResetPassword" style="width:450px;">
            <div class="box-title">
                <a href="javascript:void(0)" class="pull-right" style="color: #ffffff;" onclick="$.fancybox.close();"><i class="fa fa-times"></i></a>
                修改登录密码
            </div>
            <div class="box-content">
                <div class="resetpwd-form">
                    <h3 style="font-size:16px;">
                        密码由6个以上字符组成，区分大小写，为提升您的密码安全性，建议使用字母加数字或符号的组合
                    </h3>
                    <div class="resetpwd-input-group">
                        <input id="oldpwd" name="oldpwd" type="password" placeholder="请输入当前密码" maxlength="100" />
                    </div>
                    <div class="resetpwd-input-group">
                        <input id="newpwd" name="newpwd" type="password" placeholder="请输入新密码" maxlength="100" />
                    </div>
                    <div class="resetpwd-input-group">
                        <input id="newpwdconfirm" type="password" placeholder="请再次输入新密码" maxlength="100" />
                    </div>
                </div>
                <p id="resetpwdnotice" style="display: none;color: #F00;margin-left: 60px;"></p>
                <div class="box-buttons">
                    <button type="submit" class="greenbtn">确认修改</button>
                </div>
            </div>
        </div>
    </div>
    <empty name='isQp'>
        <script type="text/javascript">
            require(["jquery", "jquery.fancybox"], function ($, fancybox) {
                $(document).ready(function () {
                    //事件、回调注册
                    $("#btnQuestions").click(function () {
                        $.fancybox.open("#boxQuestions", { autoSize: true, padding: 0, closeBtn: false });
                    });
                    $("#boxQuestions button[type='submit']").click(function () {
                        //确认 密保问题设置
                        var url = "{:U('User/setprotectquestion_ajax')}";
                        var q1 = $('#ddlQuestion1').find("option:selected").val();
                        var a1 = $('#txtAnswer1').val();
                        var q2 = $('#ddlQuestion2').find("option:selected").val();
                        var a2 = $('#txtAnswer2').val();
                        if (a1 == '') {
                            $('#pqnotice').show();
                            $('#pqnotice').text('请填写第一个密保问题的答案');
                        }
                        if (a2 == '') {
                            $('#pqnotice').show();
                            $('#pqnotice').text('请填写第二个密保问题的答案');
                        }
                        $.post(url, { 'q1': q1, 'a1': a1, 'q2': q2, 'a2': a2 }, function (data) {
                            var vdata = eval(data);
                            if (vdata.success == 1) {
                                $.fancybox.close();
                                alert('密保问题设置成功！');
                                window.location.reload();
                            }
                            else {
                                alert(vdata.msg);
                            }
                        }, 'json');

                    });
                });
            });
        </script>
    </empty>
    <empty name="userinfo['protectemail']">
        <script>
            require(["jquery", "jquery.fancybox"], function () {
                $("#btnEmails").click(function () {
                    $.fancybox.open("#boxBindingEmail", { autoSize: true, padding: 0, closeBtn: false });
                });
                $("#boxBindingEmail button[type='submit']").click(function () {
                    //确认 绑定密保邮箱
                    var url = "{:U('User/bindemail_ajax')}";
                    var pemail = $('#txtEmail').val();
                    $.post(url, { 'pemail': pemail }, function (data) {
                        var vdata = eval(data);
                        if (vdata.success == 1) {
                            $.fancybox.close();
                            alert('成功绑定密保邮箱!');
                            window.location.reload();
                        }
                        else {
                            alert(vdata.msg);
                        }
                    }, 'json');

                });
            });
        </script>
    </empty>
    <script>
        require(["jquery", "jquery.fancybox"], function ($, messageBox) {
            $("#btnResetPassword").click(function () {
                $.fancybox.open("#boxResetPassword", { autoSize: true, padding: 0, closeBtn: false });
            });

            $("#boxResetPassword button[type='submit']").click(function () {
                //确认修改
                var url = "{:U('User/changepwd_ajax')}";
                var oldpwd = $('#oldpwd').val();
                var newpwd = $('#newpwd').val();
                $('#resetpwdnotice').text("");
                var newpwdconfirm = $('#newpwdconfirm').val();
                if (oldpwd == '') {
                    $('#resetpwdnotice').show();
                    $('#resetpwdnotice').text('请填写旧密码');
                }
                var newpwdRegex = /[0-9A-Za-z]{6,16}/;
                if (newpwd == '') {
                    $('#resetpwdnotice').show();
                    $('#resetpwdnotice').text('请填写新密码');
                }
                console.log(newpwdRegex.test(newpwd));
                if (!newpwdRegex.test(newpwd)) {
                    $('#resetpwdnotice').show();
                    $('#resetpwdnotice').text('新密码至少6位，包括数字、大小写英文字母');
                }
                if (newpwdconfirm == '') {
                    $('#resetpwdnotice').show();
                    $('#resetpwdnotice').text('请填写新密码确认输入框');
                }
                if (newpwd != newpwdconfirm) {
                    $('#resetpwdnotice').show();
                    $('#resetpwdnotice').text('两次输入的新密码不一致');
                }
                if ($('#resetpwdnotice').text() != "") {
                    return;
                }
                $.post(url, { 'oldpwd': oldpwd, 'newpwd': newpwd, 'newpwdconfirm': newpwdconfirm }, function (data) {
                    var vdata = eval(data);
                    if (vdata.success == 1) {
                        $.fancybox.close();
                        alert('重设密码成功!');
                    }
                    else {
                        $('#resetpwdnotice').show();
                        $('#resetpwdnotice').text(vdata.msg);
                    }
                }, 'json');
            });
        });
    </script>
</block>
